﻿<<template>
  <div class="table">
    <!--表7桑园套种农作物情况调查表T_MulInterCrops-->
    <div class="divSearch">
      <Row>
        <Col span="24" class="col-margin"> 填报年度：
        <Select v-model="searchModel.FillInYear" placeholder="全部" style="width: 100px" @on-change="getPageData()">
                        <Option value="">全部</Option>
                        <Option :value="item.DictText" v-for="item in CreateYearList" :key="item.DictText">{{item.DictText}}</Option>
                    </Select> 时间周期：
        <Select v-model="searchModel.TimesType" placeholder="全部" style="width: 100px" @on-change="getPageData()">
                        <Option value="">全部</Option>
                        <Option :value="item.DictValue" v-for="item in CycleList" :key="item.DictValue">{{item.DictText}}</Option>
                    </Select>
        <Button icon="ios-search" type="ghost" @click="getPageData()" style="margin-left: 5px;background: linear-gradient(to bottom, #64c8ef 0%,#00a2e2 100%);color: #fff;border-radius: 3px;text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.3);">
                        查询
                    </Button>
        <!-- <Button icon="ios-cloud-download" type="primary" @click="TmpDown()" class="searchButton" style="width: 100px;">模板下载</Button> -->
        </Col>
      </Row>
    </div>
    <Row>
      <Col span="24" class="col-margin">
        <table class="reptable">
          <caption>
              <label style="float:left">{{searchModel.FillInYear}}表6桑园套种农作物情况调查表</label>
              <label style="float:right">当前状态:
                <Poptip trigger="hover" placement="left-start" v-model="visible" :content="ReportOpinion" v-if="status==0">
                  <span  class="Error">重新填写</span> 
                </Poptip>
                <span v-else-if="status==1" class="NoReport">未填写</span>
                <span v-else-if="status==2" class="AlreadyReport">已填写</span>
                <span v-else-if="status==3" class="UpReport">已上报</span>
                <span v-else-if="status==4" class="Success">审核通过</span>  
                <span v-else class="NoReport">无需填报</span>                  
              </label><br/>
              <span style="font-size: 14px;color:red;float:right;">单位：面积----亩、产值----万元</span>
          </caption>
          
          <tr>
            <th colspan="2" v-for="(tabPane,index) in TabTitleList"><b>{{tabPane.SortName}}</b></th>
          </tr>
          <tr>
            <th v-for="item in TabTitleListTwo">{{item.ItemName}}</th>
          </tr>
          <tr style="height:40px;">
            <td v-for="item in TabTitleListTwo">
              <Input v-model="item.Quantity"></Input>
            </td>
          </tr>
        </table>
        <div class="divButton">
          <Button type="primary" @click="save(id)" :disabled="status < 3 && BtnSaveStatus ? false:true">保存</Button>
          <Button type="primary" @click="upReport(id)" :disabled="status == 2 ? false:true">上报</Button>
        </div>
        <Alert banner type="error">
          <p style="color:red;">填报说明:</p>
            1、合计面积=马铃薯面积+大豆面积+蚕豆面积+辣椒面积+其它面积
          <br/>2、合计产值=马铃薯产值+大豆产值+蚕豆产值+辣椒产值+其它产值
          <p style="color:red;font-size: 16px;padding-top: 10px;">特别注意：若指标项没有数据，请直接填“0”</p>
          <span slot="desc"></span>
        </Alert>
      <!-- <Table size="small" :height="clientHeight" border :context="ctx" :columns="columnsList" :data="datas.rows" no-data-text='暂无数据...'></Table> -->
      </Col>
    </Row>
    <!-- <Row>
      <Col span="24" class="dataTable">
      <Page style="float:right;margin: 5px 20px 5px 0;" class="page-style" :total="datas.total" placement="top" @on-change="getPageNumber"
        :page-size="searchModel.PageSize" :page-size-opts='pageSizeOpts' show-sizer @on-page-size-change="getPageSize" show-total
        show-elevator></Page>
      </Col>
    </Row> -->
  </div>
  </template>

  <script>
    export default {
      data() {
        const validateNumber = (rule, value, callback) => {
          if (!Number.isInteger(value)) {
            callback(new Error('请输入数字值'));
          } else {
            if (value < 18) {
              callback(new Error('必须年满18岁'));
            } else {
              callback();
            }
          }
        };
        return {
          visible:true,
          ReportOpinion:'',
          datas: {}, //table数据对象
          dataIds: [],
          AreaTotal: 0,
          ValTotal: 0,
          index:0,
          TableCodeList: this.GetGroupDict("ReportTableName"), //表名称
          CreateYearList: this.GetGroupDict("ReportYear"), //上报年份
          CycleList: this.GetGroupDict("ReportCycle"), //周期
          CurrentYear: this.GetCurrentYear(), //当前年度
          pageSizeOpts: [20, 40, 50], //默认分页最大设置
          showType: false, //编辑框弹出状态
          ViewShow: false,
          selectTabName: '',
          id:'',
          status:0,
          BtnSaveStatus: false, //保存按钮开关
          TabTitleList: [], //tab选项卡列表
          TabTitleListTwo: [], //table选项卡列表
          //查询模型：根据需求删除不不要查询条件
          searchModel: {
            ReportCode: 'MulInterCrops',
            FillInYear: '',
            TimesType: '',
            AreaCode: '',
            PageNumber: 1,
            PageSize: 20
          },
          dataModel: { //编辑模型
            Id: 0,
            ReportId: '',
            SeedSize: '',
            FreshCocoonYield: '',
            AveFreshCocoon: '',
            SmallRearSilk: '',
            NextSeaOutPut: '',
            NextSeaFresh: '',
          },
          ctx: this, //table数据上下文
          clientHeight: window.innerHeight - 260, //表格默认高度
        }
      },
      mounted() {
        //table高度计算方法
        const that = this;
        window.onresize = () => {
          return (() => {
            that.clientHeight = window.innerHeight - 260;
          })()
        };
      },
      methods: {
        upReport(id) {
          var self = this;
          self.$Modal.confirm({
            title: '提示信息',
            content: '<p>是否确认上报？</p>',
            onOk: () => {
              var model = new Object();
              model.Id = id;
              model.reportType = '3';
              model.strMsg = '';
              this.$http.post("Report/PostUpStatus", model).then(
                function (res) {
                  if (res.data.status == 1) {
                    self.$Notice.success({
                      title: '已上报！',
                      desc: false
                    });
                    self.getPageData();
                  } else {
                    self.$Modal.error({
                      title: "提示信息",
                      content: "数据删除失败!!!"
                    });
                  }
                }
              );
            }
          });
        },
        getTab(name) {
          this.selectTabName = name;
        },
        //获取当前页码
        getPageNumber(pageIndex) {
          this.searchModel.PageNumber = pageIndex;
          this.getPageData();
        },
        //获取当前分页大小
        getPageSize(pageSize) {
          this.searchModel.PageSize = pageSize;
          this.getPageData();
        },
        //获取this.datas: {},//table数据对象
        getPageData() {
          var self = this;
          var user = this.GetlocaStorage("CSuserinfo");
          this.searchModel.AreaCode = user.AreaCode;
          if (self.searchModel.FillInYear != null && self.searchModel.FillInYear != '') {
            this.searchModel.FillInYear = self.searchModel.FillInYear;
          } else {
            this.searchModel.FillInYear = self.CurrentYear + '年'; //填报年度-----数据字典值
          }
          self.$http.post('Report/PostPageList', this.searchModel).then(function (res) {
            if (res.data.status === 1) {
              console.log(res.data);
              self.datas = res.data;
              self.ReportOpinion=res.data.Opinion;
              for(var i=0;i<res.data.total;i++){
                if(res.data.rows[i].FillInYearName==self.searchModel.FillInYear){
                  self.id = res.data.rows[i].Id;
                  if (res.data.rows[i].Status == 2 || res.data.rows[i].Status == 1) {
                    self.BtnSaveStatus = true;
                  } else {
                    self.BtnSaveStatus = false;
                  }
                  self.status = res.data.rows[i].Status;
                }
              }
               self.editInfo();
            } else {
              self.$Modal.error({
                title: '提示信息',
                content: res.data.message
              });
            }
          });
        },
        editInfo() { //编辑
          var self = this;
          this.$http.get("Report", {
            params: {
              id: this.id,
              reportCode: self.searchModel.ReportCode
            }
          }).then( //获取数据编辑项的值
            function (res) {
              switch (res.data.list.status) {
                case 1:
                  self.initTab(self, res.data.list.model);
                  //self.modalShow();
                  self.initTabTwo(self, res.data.list.model);
                  self.selectTabName = self.TabTitleList[0].SortCode;
                  break;
                case 0:
                  self.$Modal.error({
                    title: "提示信息",
                    content: "编辑数据加载失败!!!"
                  });
                  break;
                case -1:
                  self.$Modal.error({
                    title: "提示信息",
                    content: "编辑数据加载失败!!!"
                  });
                  break;
              }
            }
          );
        },
        initTab(self, datas) {
          self.TabTitleList = [];
          for (var i = 0; i < datas.length; i++) {
            if (!self.checkTab(datas[i].SortCode, self)) {
              var item = new Object();
              item.SortCode = datas[i].SortCode;
              item.SortName = datas[i].SortName;
              item.list = [];
              for (var j = 0; j < datas.length; j++) {
                if (datas[j].SortCode == datas[i].SortCode) {
                  if (!self.checkItem(item.list, datas[j].ItemCode)) {
                    item.list.push(datas[j]);
                  }
                }
              }
              self.TabTitleList.push(item);
            }
          }
          return self.TabTitleList;
        },
        initTabTwo(self, datas) {
          self.TabTitleListTwo = [];
          self.AreaTotal = 0;
          self.ValTotal = 0;
          for (var i = 0; i < datas.length; i++) {
            if (datas[i].Unit == "亩") {
              self.AreaTotal = self.AreaTotal + datas[i].Quantity;
            } else if (datas[i].Unit == "万元") {
              self.ValTotal = self.ValTotal + datas[i].Quantity;
            }
            datas[i].ReportId = self.id;
            self.TabTitleListTwo.push(datas[i]);
          }
          return self.TabTitleListTwo;
        },
        checkTab(SortCode, self) {
          var res = false;
          for (var i = 0; i < self.TabTitleList.length; i++) {
            if (self.TabTitleList[i].SortCode == SortCode) {
              res = true;
            }
          }
          return res;
        },
        checkItem(datas, ItemCode) {
          var res = false;
          for (var i = 0; i < datas.length; i++) {
            if (datas[i].ItemCode == ItemCode) {
              res = true;
            }
          }
          return res;
        },
        checkListEmpty(list){
          for(var i = 0; i < list.length; i++){
            if(list[i].Quantity!=null&& list[i].Quantity!=""&&list[i].Quantity!=" "){
              self.index = i + 1;
              continue;
            }
          }
          if(self.index==list.length){
            return true;
          }else{
            return false;
          }
        },
        //保存方法
        save(id) {
          var self = this;
          //var list = this.findItemList(this.selectTabName);
          var list = this.TabTitleListTwo;
          for(var i = 0; i < list.length; i++){
            list.ReportId = id;
          }
          if(self.checkListEmpty(list)){
            this.$http.put('MulInterCrops', list).then(
              function (res) {
                if (res.data.status == 1) {
                  self.getPageData(); //读取分页数据
                  self.editInfo();
                  //self.modalHide(); //关闭modal
                  self.$Notice.success({
                    title: '保存成功！',
                    desc: false
                  });
                } else {
                  self.$Modal.warning({
                    title: "提示信息",
                    content: "更新失败,请与管理员联系!"
                  });
                }
            });
          }else{
            this.$Message.error('数据填写有误！！！请检查空白处');
          }
        },
        findItemList(tabname) {
          var list = [];
          for (var i = 0; i < this.TabTitleList.length; i++) {
            if (this.TabTitleList[i].SortCode == tabname) {
              list = this.TabTitleList[i].list;
              break;
            }
          }
          return list;
        },
        //编辑框打开
        modalShow() {
          this.showType = true;
        },
        //编辑框关闭
        modalHide() {
          this.showType = false;
        },
        //取消方法
        cancel() {
          this.showType = false; //关闭modal
          this.TabTitleList = [];
        },
        //重置model
        restModel(modelname) {
          this.$refs[modelname].resetFields(); //重置model
        },
        //模板下载
        TmpDown: function () {
          window.open(this.$http.defaults.baseURL + "Report/GetTemplateData?ReportCode=" + this.searchModel.ReportCode);
        },
        //导入
        GetPostUrl(ReportId) {
            var url = this.$http.defaults.baseURL + "Report/PostImportDataTwo?ReportId=" + ReportId + "&&ReportCode=" + this.searchModel.ReportCode;
            return url;
        },
        handleSuccess() {
            this.getPageData();
            this.$Notice.success({
                title: '数据导入成功！',
                desc: false
            });
        },
        //导出
      ExcelDown: function (ReportId, ReportName) {
        var self = this;
        window.open(this.$http.defaults.baseURL + "MulInterCrops/GetExcelData?ReportId=" + ReportId +
          "&&ReportName=" + ReportName);
      },
      },
      //创建Vue页面方法
      created: function () {
        //创业Vue前调用获取this.datas: {},//table数据对象
        this.getPageData();
        //this.editInfo();
      },
      watch: {
        //需要监听的在此处新增监听对象
      }
    }

  </script>
